<!--
 * Author: byron
 * Date: 2021-10-18 08:35:55
 * LastEditTime: 2022-02-07 17:15:21
-->
<!DOCTYPE html>
<html lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!--  content设置为yesWeb应用会以全屏模式运行,反之则不会;content的默认值是no,表示正常显示,可以通过只读属性window.navigator.standalone来确定网页是否以全屏模式显示 -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
  <!-- 设置收藏夹图标 -->
  <link rel="shortcut icon" href="https://image.huos77.cn/favicon.svg" />
  <link rel="stylesheet" href="//at.alicdn.com/t/font_2682974_nsti2y2iut.css">



  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link
    href="https://fonts.googleapis.com/css2?family=Amiri&family=Average+Sans&family=Bubblegum+Sans&family=Caudex:wght@700&family=Hind:wght@300&family=PT+Sans+Narrow:wght@700&family=Prompt&family=Taviraj:wght@100&family=Titillium+Web:wght@200&family=Trirong:ital,wght@1,300&display=swap"
    rel="stylesheet">

  <title><%= htmlWebpackPlugin.options.title %></title>
  <% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
  <script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
  <% } %>

  <!-- 页面另起窗口打开 -->
  <!-- <base target="_blank" /> -->

  <style lang="css">
    .loading-mask {
      display: block;
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      top: 0;
      z-index: 9;
      background-color: rgba(225, 225, 225, 0.9);
    }

    .loader {
      position: relative;
      width: 2.5em;
      height: 2.5em;
      transform: rotate(165deg);
    }

    .loader::before,
    .loader::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      display: block;
      width: 0.5em;
      height: 0.5em;
      border-radius: 0.5em / 2;
      transform: translate(-50%, -50%);
    }

    .loader::before {
      animation: before 2s infinite;
    }

    .loader::after {
      animation: after 2s infinite;
    }

    @keyframes before {
      0% {
        width: 0.5em;
        box-shadow: 1em -0.5em rgba(337, 84, 48, 0.75),
          -1em 0.5em rgba(190, 61, 65, 0.75);
      }

      35% {
        width: 2.5em;
        box-shadow: 0 -0.5em rgba(337, 84, 48, 0.75),
          0 0.5em rgba(190, 61, 65, 0.75);
      }

      70% {
        width: 0.5em;
        box-shadow: -1em -0.5em rgba(337, 84, 48, 0.75),
          1em 0.5em rgba(190, 61, 65, 0.75);

      }

      100% {
        box-shadow: 1em -0.5em rgba(337, 84, 48, 0.75),
          -1em 0.5em rgba(190, 61, 65, 0.75);
      }
    }

    @keyframes after {
      0% {
        height: 0.5em;

        box-shadow: 0.5em 1em rgba(160, 50, 48, 0.75),
          -0.5em -1em rgba(41, 82, 52, 0.75);
      }

      35% {
        height: 2.5em;
        box-shadow: 0.5em 0 rgba(160, 50, 48, 0.75),
          -0.5em 0 rgba(41, 82, 52, 0.75);
      }

      70% {
        height: 0.5em;
        box-shadow: 0.5em -1em rgba(160, 50, 48, 0.75),
          -0.5em 1em rgba(41, 82, 52, 0.75);
      }

      100% {
        box-shadow: 0.5em 1em rgba(160, 50, 48, 0.75),
          -0.5em -1em rgba(41, 82, 52, 0.75);
      }
    }

    /**
     * Attempt to center the whole thing!
     */

    html,
    body {
      height: 100%;
    }

    .loader {
      position: absolute;
      top: calc(50% - 2.5em / 2);
      left: calc(50% - 2.5em / 2);
    }
  </style>
</head>

<body>
  <noscript>
    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
      Please enable it to continue.</strong>
  </noscript>
  <div id="app">
    <div class="loading-mask">
      <div class="loader"></div>
    </div>
  </div>

</body>
<link rel="stylesheet/less" type="text/css" href="/theme.less" />
<script>
  window.less = {
    async: false,
    env: 'production'
  };
  window.colorReadyCallBack && window.colorReadyCallBack();
</script>
<script src="https://cdn.staticfile.org/less.js/2.7.2/less.min.js"></script>

</html>